$(function () {
    initLayerDate("#lookCourseDate",true);
    initLayerDate("#lookToCourseDate",true);
    initLayerDate("#lookLiveDate",true);
    initLayerDate("#lookToLiveDate",true);
    if (courseType == 'VIDEO' || courseType == 'PACKAGE') {
        queryCourseStatis($("#courseId").val());
        queryStudy(2, null, null);
        queryFinishCourse(2, null, null);
        // 学习走势图
        document.getElementById("form-time-type").addEventListener("statistics-time",function (evt) {
            queryStudy(evt.detail.type, evt.detail.startTime, evt.detail.endTime);
        });
        document.getElementById("finish-time-type").addEventListener("statistics-time",function (evt) {
            queryFinishCourse(evt.detail.type, evt.detail.startTime, evt.detail.endTime);
        });

        initTimeType("form-time-type");
        initTimeType("finish-time-type");
        initTime("formStatTimeLaydate","formEndTimeLaydate",'form-time-type');
        initTime("finishStatTimeLaydate","finishEndTimeLaydate",'finish-time-type');
    }else{
        document.getElementById("live-time-type").addEventListener("statistics-time",function (evt) {
            queryLiveOnlineStatis(evt.detail.type, evt.detail.startTime, evt.detail.endTime);
        });
        queryLiveOnlineStatis(2, null, null);
        initTimeType("live-time-type");
        initTime("liveStatTimeLaydate","liveEndTimeLaydate",'live-time-type');
        initLiveBox();
        queryLiveStatis();
    }

    $("body").on("click",".share-to-user",function () {
        let courseId = $(this).data("id");
        let courseType = $(this).data("coursetype");
        shareAddressFn(courseId, courseType);
    }).on("click",".courseListBtn",function () {
        getCoursePlayRecordSubmit(1,"course_play_record_list","courseForm");
    }).on("click",".liveListBtn",function () {
        getCoursePlayRecordSubmit(1,"live_play_record_list","liveForm");
    }).on('click', '.lookCourse', function () { //课程详情查看(不含章节)
        var courseId = $(this).data('id');
        var courseName = $(this).data('name');
        var courseTypeKey = $(this).data('type');
        parent.layer.open({
            area: winArea,
            btn: ['关闭'],
            content: baseloaction + "/admin/course/cou/previewCourse?courseId=" + courseId + '&courseType=' + courseTypeKey,
            maxmin: true,
            shade: [0.3, '#000'],
            shadeClose: false,
            title: '查看课程[<small>' + courseName + '</small>]',
            type: 2,
            yes: function (index) {
                parent.layer.close(index);
            }
        });
    }).on('click', '.lookCoursePlayDetail', function () { //课程详情查看(不含章节)
        var courseId = $(this).data('courseid');
        var buyCourseId = $(this).data('buycourseid');
        var userId = $(this).data('userid');
        var catalogId = $(this).data('catalogid');
        var playname = $(this).data('playname');
        parent.layer.open({
            area: winArea,
            btn: ['关闭'],
            content: baseloaction + "/admin/user/cus/queryCoursePlayDetail?userId=" + userId + '&buyCourseId=' + buyCourseId+'&courseId=' + courseId+'&catalogId=' + catalogId,
            maxmin: true,
            shade: [0.3, '#000'],
            shadeClose: false,
            title: '查看学习[<small>' + playname + '</small>]明细',
            type: 2,
            yes: function (index) {
                parent.layer.close(index);
            }
        });
    }).on("click","#catalogBox",function () {
        var that=this
        parent.layer.open({
            type: 2,
            area: winArea,
            skin: 'layui-layer-demo',
            title: '直播互动信息列表',
            btn:["确定"],
            content: baseloaction + "/admin/stat/toCatalogList?courseId=" + $("#courseId").val(),
            yes:function (index,layero) {
                var body = parent.layer.getChildFrame('body', index);
                var materialId = body.find('#materialId').val();
                var catalogId = body.find('#catalogId').val();
                var catalogName = body.find('#catalogName').val();

                if (catalogName && materialId && catalogId) {
                    $("#catalogName").text(catalogName);
                }
                queryLiveStatis(materialId, catalogId);
                parent.layer.closeAll();
            }
        });

    }).on("click","#chatMsgBtn",function () {
        if (!materialId) {
            layer.msg("请选择具体章节后查看")
            return;
        }
        parent.layer.open({
            type: 2,
            area: winArea,
            skin: 'layui-layer-demo',
            title: '聊天信息列表',
            btn:false,
            content: baseloaction + "/admin/stat/toChatMsgList?materialId=" + materialId
        });
    }).on("click","#rollcallBtn",function () {
        if (!materialId) {
            layer.msg("请选择具体章节后查看")
            return;
        }
        parent.layer.open({
            type: 2,
            area: winArea,
            skin: 'layui-layer-demo',
            title: '签到信息列表',
            btn:false,
            content: baseloaction + "/admin/stat/toRollCallList?materialId=" + materialId
        })
    }).on("click","#interactiveBtn",function () {
        if (!materialId) {
            layer.msg("请选择具体章节后查看")
            return;
        }
        parent.layer.open({
            type: 2,
            area: winArea,
            skin: 'layui-layer-demo',
            title: '直播互动信息列表',
            btn:false,
            content: baseloaction + "/admin/stat/tointeractiveList?materialId=" + materialId
        });
    }).on("click",".chatmsgList",function () {
        getChatMsgPage(1);
    }).on("click",".interactiveList",function () {
        getLiveInteractivePage(1);
    }).on("click",".rollcallList",function () {
        getRollCallPage(1);
    }).on("click","#downloadChatMsgList",function () {
        window.location.href="/admin/course/cou/downloadChatMsgList?materialId="+materialId
    }).on("click","#downloadInteractiveList",function () {
        window.location.href="/admin/course/cou/downloadInteractiveList?materialId="+materialId
    }).on("click","#downloadRollCallList",function () {
        window.location.href="/admin/course/cou/downloadRollCallList?materialId="+materialId
    }).on("click","#allCatalog",function () {
        window.location.reload();
    }).on("click",".livePlayRecordSubmit",function () {
        getCoursePlayRecordSubmit(1,"live_play_record_list","liveForm");
    }).on("click",".coursePlayRecordSubmit",function () {
        getCoursePlayRecordSubmit(1,"course_play_record_list","courseForm");
    })
});
function shareAddressFn(id,type) {
    parent.layer.open({
        type: 2,
        area: ['320px', '420px'],
        skin: 'layui-layer-demo',
        title: '分享地址',
        btn:false,
        content: [`${baseloaction}/admin/course/cou/shareCourseToUser?courseId=${id}&type=${type}`,'no']
    })
}

/**
 * 课程学习记录统计图
 * @param xAxisList
 * @param yAxisListOfStudy
 * @param yAxisListOfRate
 */
function initStudyBox(xAxisList,yAxisListOfStudy,yAxisListOfRate) {
    var regUserEChart = echarts.init(document.getElementById("study-box"));
    var option = {
        tooltip: {
            trigger: 'axis',
            axisPointer: {
                type: 'cross',
                crossStyle: {
                    color: '#999'
                }
            }
        },
        grid: {
            top: 'middle',
            left: '3%',
            right: '4%',
            bottom: '3%',
            height: '80%',
            containLabel: true
        },
        legend: {
            data: ['学习人数', '学习时长']
        },
        xAxis: [
            {
                type: 'category',
                data: xAxisList,
                axisLine: {
                    lineStyle: {
                        color: "#333"
                    }
                }
            }
        ],
        yAxis: [
            {
                type: 'value',
                name: '学习人数',
                axisLabel: {
                    formatter: '{value}'
                },
                splitLine: {
                    lineStyle: {
                        type: 'dashed',
                        color: '#DDD'
                    }
                },
                axisLine: {
                    lineStyle: {
                        color: "#333"
                    },
                    onZero: false,
                },
                axisTick: {
                    alignWithLabel: true
                },
                nameTextStyle: {
                    color: "#999"
                },
                splitArea: {
                    show: false
                }
            },
            {
                type: 'value',
                name: '学习时长',
                axisLabel: {
                    formatter: '{value} '
                },
                splitLine: {
                    lineStyle: {
                        type: 'dashed',
                        color: '#DDD'
                    }
                },
                axisLine: {
                    lineStyle: {
                        color: "#333"
                    },
                    onZero: false,
                },
                axisTick: {
                    alignWithLabel: true
                },
                nameTextStyle: {
                    color: "#999"
                },
                splitArea: {
                    show: false
                }
            }
        ],
        series: [
            {
                name: '学习人数',
                type: 'line',
                yAxisIndex: 0,
                data:yAxisListOfStudy ,
                color: "#fbd44b",
                lineStyle: {
                    normal: {
                        width: 3,
                        color: {
                            type: 'linear',

                            colorStops: [{
                                offset: 1,
                                color: "#1890ff" // 0% 处的颜色
                            }],
                            globalCoord: false // 缺省为 false
                        }
                    }
                },
                itemStyle: {
                    normal: {
                        color: "#1890ff",
                        borderWidth: 7,
                        borderColor:"#1890ff"
                    }
                },
                smooth: true
            },
            {
                name: '学习时长',
                type: 'line',
                yAxisIndex: 1,
                data: yAxisListOfRate,
                color: "#2fc25b",
                lineStyle: {
                    normal: {
                        width: 3,
                        color: {
                            type: 'linear',

                            colorStops: [{
                                offset: 1,
                                color: "#2fc25b" // 0% 处的颜色
                            }],
                            globalCoord: false // 缺省为 false
                        }
                    }
                },
                itemStyle: {
                    normal: {
                        color: "#2fc25b",
                        borderWidth: 7,
                        borderColor:"#2fc25b"
                    }
                },
                smooth: true
            }
        ]
    };
    regUserEChart.setOption(option);
    $(window).resize(regUserEChart.resize);
}

/**
 * 课程完成率统计图
 * @param xAxisList
 * @param yAxisListOfStudy
 * @param yAxisListOfRate
 */
function initFinishBox(xAxisList,yAxisListOfStudy,yAxisListOfRate) {
    var regUserEChart = echarts.init(document.getElementById("finish-box"));
    var option = {
        tooltip: {
            trigger: 'axis',
            axisPointer: {
                type: 'cross',
                crossStyle: {
                    color: '#999'
                }
            }
        },
        legend: {
            data: ['完课人数', '完课率']
        },
        grid: {
            top: 'middle',
            left: '3%',
            right: '4%',
            bottom: '3%',
            height: '80%',
            containLabel: true
        },
        xAxis: [
            {
                type: 'category',
                data: xAxisList,
                axisLine: {
                    lineStyle: {
                        color: "#333"
                    }
                }
            }
        ],
        yAxis: [
            {
                type: 'value',
                name: '完课人数',
                axisLabel: {
                    formatter: '{value}'
                },
                splitLine: {
                    lineStyle: {
                        type: 'dashed',
                        color: '#DDD'
                    }
                },
                axisLine: {
                    lineStyle: {
                        color: "#333"
                    },
                    onZero: false,
                },
                axisTick: {
                    alignWithLabel: true
                },
                nameTextStyle: {
                    color: "#999"
                },
                splitArea: {
                    show: false
                }
            },
            {
                type: 'value',
                name: '完课率',
                axisLabel: {
                    formatter: '{value}% '
                },
                splitLine: {
                    lineStyle: {
                        type: 'dashed',
                        color: '#DDD'
                    }
                },
                axisLine: {
                    lineStyle: {
                        color: "#333"
                    },
                    onZero: false,
                },
                axisTick: {
                    alignWithLabel: true
                },
                nameTextStyle: {
                    color: "#999"
                },
                splitArea: {
                    show: false
                }
            }
        ],
        series: [
            {
                name: '完课人数',
                type: 'line',
                yAxisIndex: 0,
                data:yAxisListOfStudy ,
                color: "#fbd44b",
                lineStyle: {
                    normal: {
                        width: 3,
                        color: {
                            type: 'linear',

                            colorStops: [{
                                offset: 1,
                                color: "#fbd44b" // 0% 处的颜色
                            }],
                            globalCoord: false // 缺省为 false
                        }
                    }
                },
                itemStyle: {
                    normal: {
                        color: "#fbd44b",
                        borderWidth: 7,
                        borderColor:"#fbd44b"
                    }
                },
                smooth: true
            },
            {
                name: '完课率',
                type: 'line',
                yAxisIndex: 1,
                data: yAxisListOfRate,
                color: "#f4667c",
                lineStyle: {
                    normal: {
                        width: 3,
                        color: {
                            type: 'linear',

                            colorStops: [{
                                offset: 1,
                                color: "#f4667c" // 0% 处的颜色
                            }],
                            globalCoord: false // 缺省为 false
                        }
                    }
                },
                itemStyle: {
                    normal: {
                        color: "#f4667c",
                        borderWidth: 7,
                        borderColor:"#f4667c"
                    }
                },
                smooth: true
            }
        ]
    };
    regUserEChart.setOption(option);
    $(window).resize(regUserEChart.resize);
}

/**
 * 直播统计图
 * @param xAxisList
 * @param yAxisListOfStudy
 * @param yAxisListOfRate
 */
function initLiveBox(xAxisList,yAxisListOfStudy) {
    //var xAxisList = ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月', '9月', '10月', '11月', '12月'];
    //var yAxisListOfStudy = [3, 5, 3, 1, 6, 10, 10, 24, 20, 14, 18, 7];

    var regUserEChart = echarts.init(document.getElementById("live_box"));
    var option = {
        tooltip: {
            trigger: 'axis',
            axisPointer: {
                type: 'cross',
                crossStyle: {
                    color: '#999'
                }
            }
        },
/*        legend: {
            data: '人数'
        },*/
        grid: {
            top: 'middle',
            left: '3%',
            right: '4%',
            bottom: '3%',
            height: '80%',
            containLabel: true
        },
        xAxis: [
            {
                type: 'category',
                data: xAxisList,
                axisLine: {
                    lineStyle: {
                        color: "#333"
                    }
                }
            }
        ],
        yAxis: {
                type: 'value',
                name: '人数',
                axisLabel: {
                    formatter: '{value} '
                },
                splitLine: {
                    lineStyle: {
                        type: 'dashed',
                        color: '#DDD'
                    }
                },
                axisLine: {
                    lineStyle: {
                        color: "#333"
                    },
                    onZero: false,
                },
                axisTick: {
                    alignWithLabel: true
                },
                nameTextStyle: {
                    color: "#999"
                },
                splitArea: {
                    show: false
                }
            }
        ,
        series: {
                name: '人数',
                type: 'line',
                yAxisIndex: 0,
                data:yAxisListOfStudy ,
                color: "#fbd44b",
                lineStyle: {
                    normal: {
                        width: 3,
                        color: {
                            type: 'linear',

                            colorStops: [{
                                offset: 1,
                                color: "#fbd44b" // 0% 处的颜色
                            }],
                            globalCoord: false // 缺省为 false
                        }
                    }
                },
                itemStyle: {
                    normal: {
                        color: "#fbd44b",
                        borderWidth: 7,
                        borderColor:"#fbd44b"
                    }
                },
                smooth: true
            },
    };
    regUserEChart.setOption(option);
    $(window).resize(regUserEChart.resize);
}


function queryStudy(type,startTime,endTime) {
    $.ajax({
        url:baseloaction+"/admin/stat/queryCourseStudyStatis",
        data:{
            type:type,
            startTime:startTime,
            endTime: endTime,
            courseId: $("#courseId").val()
        },
        dataType:"json",
        type:"post",
        beforeSend:function(XH){
            $("#trade-loading-box").removeClass("hide");
            return true;
        },
        success: function (res) {
            if (res.success == true) {
                initStudyBox(res.entity.dateList,res.entity.studyNumList,res.entity.studyDurationList);
            }
        }
    })
}
function queryFinishCourse(type,startTime,endTime) {
    $.ajax({
        url:baseloaction+"/admin/stat/queryCourseFinishStatis",
        data:{
            type:type,
            startTime:startTime,
            endTime: endTime,
            courseId: $("#courseId").val()
        },
        dataType:"json",
        type:"post",
        beforeSend:function(XH){
            $("#finish-loading-box").removeClass("hide");
            return true;
        },
        success: function (res) {
            if (res.success == true) {
                initFinishBox(res.entity.dateList,res.entity.finishCourseNumList,res.entity.finishCourseRateList);
            }
        }
    })
}
function queryLiveOnlineStatis(type,startTime,endTime) {
    $.ajax({
        url:baseloaction+"/admin/stat/queryLiveOnlineStatis",
        data:{
            type:type,
            startTime:startTime,
            endTime: endTime,
            courseId: $("#courseId").val()
        },
        dataType:"json",
        type:"post",
        success: function (res) {
            if (res.success == true) {
                initLiveBox(res.entity.dateList,res.entity.onlineUserList);
            }
        }
    })
}

function queryCourseStatis(courseId) {
    $.ajax({
        url:baseloaction+"/admin/course/cou/findCourseStatis",
        data:{courseId:courseId},
        dataType:"json",
        type:"post",
        success:function (res) {
            if (res.success ==true) {
                $("#totalStudy").text(res.entity.count)
                $("#totalFinsih").text(res.entity.finishCount);
                $("#finishRate").text(res.entity.finishRate)
            }
        }
    })
}
function getCoursePlayRecordSubmit(pageNo,id,formId) {
    var params = JSON.stringify($("#" + formId).serializeJSON());
    var obj = {
        url: baseloaction + '/admin/user/cus/queryCoursePlayRecord',//请求URL
        contextId:id,//响应内容页面设置内容ID
        params:params,//请求参数
        pageNo:pageNo,//页码
        pageCall:getCoursePlayRecordSubmit, //分页回调加载数据(点击上下页时调用,该方法也在加载页面完成时调用)
        selectAllId:'11', //全选框ID
        callback:function () {//数据加载完成回调；
        }
    };
    ajaxGetListData(obj)
}

var materialId;
function queryLiveStatis(tempMaterialId,catalogId) {
    if (tempMaterialId) {
        materialId=tempMaterialId
        $("#allCatalog").show();
    }else{
        $("#allCatalog").hide();
    }
    $.ajax({
        url: baseloaction + "/admin/stat/queryLiveStatis",
        data:{
            courseId:$("#courseId").val(),
            materialId:materialId,
            catalogId:catalogId
        },
        dataType:"json",
        type:"post",
        beforeSend:function(XH){
            $("#catalog-loading-box").removeClass("hide");
            return true;
        },
        success: function (res) {
            if (res.success == true) {
                $("#average").text(res.entity.average)
                $("#liveTotalCount").text(res.entity.count);
                $("#mobileStudyCount").text(res.entity.mobileStudyCount);
                $("#pcStudyCount").text(res.entity.pcStudyCount);
                $("#totalOnlineUser").text(res.entity.totalOnlineUser);
                $("#liveTotalStudy").text(res.entity.totalStudy);
                $("#userMsgCount").text(res.entity.userMsgCount);
                $("#averageDuration").text(res.entity.averageDuration);
                $("#catalog-loading-box").addClass("hide");
                if (materialId) {
                    getLiveInteractivePage(1);
                    $("#statisBox").show();
                }
            }else{
                layer.msg("系统异常")
            }
        }
    });
}

function getChatMsgPage(pageNo) {
    var obj = {
        url: baseloaction + '/admin/stat/getChatMsgPage',//请求URL
        contextId: 'chatmsgList',//响应内容页面设置内容ID
        pageNo: pageNo,//页码
        params: JSON.stringify({materialId:materialId}),
        pageCall: getChatMsgPage, //分页回调加载数据(点击上下页时调用,该方法也在加载页面完成时调用)
        callback: function () {
        }
    };
    ajaxGetListData(obj);

}
function getLiveInteractivePage(pageNo) {
    var obj = {
        url: baseloaction + '/admin/stat/getInteractivePage',//请求URL
        contextId: 'interactiveList',//响应内容页面设置内容ID
        pageNo: pageNo,//页码
        params: JSON.stringify({materialId:materialId}),
        pageCall: getLiveInteractivePage, //分页回调加载数据(点击上下页时调用,该方法也在加载页面完成时调用)
        callback: function () {
        }
    };
    ajaxGetListData(obj);

}

function getRollCallPage(pageNo) {
    var obj = {
        url: baseloaction + '/admin/stat/getRollCallPage',//请求URL
        contextId: 'rollcallList',//响应内容页面设置内容ID
        pageNo: pageNo,//页码
        params: JSON.stringify({materialId:materialId}),
        pageCall: getRollCallPage, //分页回调加载数据(点击上下页时调用,该方法也在加载页面完成时调用)
        callback: function () {
        }
    };
    ajaxGetListData(obj);

}









